<!DOCTYPE html>
<html lang="en">
<head>
    <style>
        table{
            border-style: solid;
            border-color: lightslategrey ;
            border-width: 2px;
            width: 100%;
            background-color: beige;
            border-collapse: collapse;
        }
        #selectAll{
            width: 50%;
            /*border-color: blueviolet;*/
        }
        td{
            width: 25% ;
            text-align: center;
        }

    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <title>全选</title>
    <script type="text/javascript">
        $(function () {
            //全选按钮的单击事件
            $("#selectAll").click(function () {
                //获取selectAll复选框的checked是否选中属性，并赋值给所有name为cb的复选框
                $("[name='cb']").prop("checked",$("#selectAll").prop("checked"));
            })
        });
    </script>
</head>
<body>
<h2 align="">人物信息表</h2>
   <table border="1" width="800px" id="table" >
       <tr>
           <td><input type="checkbox" id="selectAll">全选/取消</td>
           <td>id</td>
           <td>姓名</td>
           <td>年龄</td>
       </tr>
       <tr>
           <td><input type="checkbox" name="cb"></td>
           <td>1</td>
           <td>萧炎</td>
           <td>25</td>
       </tr>
       <tr>
           <td><input type="checkbox" name="cb"></td>
           <td>2</td>
           <td>唐三</td>
           <td>20</td>
       </tr>
       <tr>
           <td><input type="checkbox" name="cb"></td>
           <td>3</td>
           <td>林凡</td>
           <td>10000</td>
       </tr>
       <tr>
           <td><input type="checkbox" name="cb"></td>
           <td>4</td>
           <td>无双</td>
           <td>18</td>
       </tr>
       <tr>
           <td><input type="checkbox" name="cb"></td>
           <td>5</td>
           <td>石昊</td>
           <td>18</td>
       </tr>
       <tr>
           <td><input type="checkbox" name="cb"></td>
           <td>6</td>
           <td>林动</td>
           <td>21</td>
       </tr>
       <tr>
           <td><input type="checkbox" name="cb"></td>
           <td>7</td>
           <td>罗峰</td>
           <td>18</td>
       </tr>
       <tr>
           <td><input type="checkbox" name="cb"></td>
           <td>8</td>
           <td>秦烈</td>
           <td>25</td>
       </tr>

   </table>
</body>
</html>